<p id="toggle_custom_info" class="text-primary" style="cursor: pointer; margin-bottom: 3px;display: inline-block;">Custom <i class="glyphicon glyphicon-resize-small"></i></p>&nbsp;&nbsp;
<div class="btn-group" role="group" aria-label="...">
                <div class="btn-group" role="group">
                        <button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                loadScript <span class="caret"></span></button>
                        <ul class="dropdown-menu">
                          <li><a href="#" onclick="loadCustomScript('normal')">loadScript</a></li>
                          <li><a href="#" onclick="loadCustomScript('sleep')">loadScript(SleepResumeApp)</a></li>
                        </ul>
                    </div>
    <button type="button" data-toggle="modal" data-target="#ScriptManage" id="CustomScriptManage" onclick="getcustominfo();" class="btn btn-default btn-xs">ScriptManage</button>
    <button type="button" class="btn btn-default btn-xs" data-toggle="modal" data-target="#SaveScript" >SaveScript</button>
</div>

<!-- Save Script Modal -->
<div class="modal fade " id="SaveScript" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" data-backdrop="static" data-keyboard="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="exampleModalLabel">Save Script</h4>
            </div>

            <div class="modal-body">
                <form>
                    <div class="form-group">
                        <label for="recipient-name" class="control-label">ScriptName:</label>
                        <input type="text" class="form-control" id="savefilename">
                    </div>
                </form>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" onclick="savefileContent('EditCustomcode')">Save </button>
            </div>
        </div>
  </div>
</div>


<!-- Script Manage Modal -->
<div class="modal fade" id="ScriptManage" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static" data-keyboard="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Script Manage</h4>
                <h6>Current Script Path: <code id="filepath" style="word-wrap:break-word"></code></h6>
            </div>

            <div class="modal-body" >
                <div class="row">
                    <div class="col-md-3  scriptManageul" id="ScriptList" >
                        <div id="customscriptlist" class="list-group " style="word-wrap:break-word"></div>
                    </div>

                    <div id="ScriptManageEditorView" class="col-md-9" style="height: 500px"></div>

                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-primary" onclick="loadfileContent()">Load this script</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" onclick="savefileContent('EditScriptManageEditorView')">Save changes</button>
                <button type="button" class="btn btn-danger" onclick="deletefile('1')">Delete this script</button>
            </div>

        </div>
    </div>
</div>

<!-- delete file -->
<div class="modal fade" id="deleteScript" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"  data-backdrop="static" data-keyboard="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="exampleModalLabel">Delete Script</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure to delete this script ?</p>
                <code id="deletefilename" style="word-wrap:break-word"></code>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-danger" onclick="deletefile('2')">Confirm</button>
            </div>
        </div>
  </div>
</div>



<div class="well" id="Custom-info-div">
    <div class="row ">
        <div class="col-sm-12 ">
            <div id="Customcode" ></div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-sm-12">
        <p style="color: #337ab7;margin: 5px 0px;"> Output Console <span class="glyphicon glyphicon-remove clickable" aria-hidden="true" onclick="clear_Custom_Message()"  ></span></p>
        <div class="table-responsive pre-scrollable" style="min-height: 500px;">
            <table class="table table-striped table-bordered" style="table-layout:fixed;word-break:break-all;">
               <thead>
                   <tr>
                     <th style="width: 90%">Info</th>
                   </tr>
               </thead>
               <tbody id="CustomOutputBody">
                    <!--<tr>-->
                        <!--<td>123</td>-->
                    <!--</tr>-->
               </tbody>
            </table>
        </div>
    </div>
</div>

